// 自定义指令
// 自定义指令可以采用统一的文件来管理  src / directives / index.js, 这个文件负责管理所有的自定义指令
// 语法：注册自定义指令
// Vue.directive('指令名称', {
//   // 会在当前指令作用的dom元素 插入之后执行
//   // options 里面是指令的表达式
//   inserted: function (dom, options) {
//   }
// })
/**
 * inserted：可以拿到dom对象,被绑定元素插入父节点时调用 (仅保证父节点存在，但不一定已被插入文档中)。
 *update：所在组件的 VNode 更新时调用，但是可能发生在其子 VNode 更新之前。指令的值可能发生了改变，也可能没有。但是你可以通过比较更新前后的值来忽略不必要的模板更新 (详细的钩子函数参数见下)。
 */
//  imgerror指令,处理图片 加载异常,如果加载失败显示一个默认图片,=>提供个img元素中使用
// 例如:<img : src = "src" v-imgerror="defaultSrc"/>

const imgerror = {
  // 图片加载失败会触发回调函数执行
  inserted (dom, options) {
    dom.onerror = () => {
      //
      dom.src = options.value
    }
  }
}

const focus = {
  // 指令的定义
  inserted: function (el) {
    // 聚焦元素
    el.focus()
  }
}

export { imgerror, focus }
